<template>
    <h2>房号信息显示</h2>
    房型名称:<input type="text" placeholder="查询房型名称" v-model="name"/>
    创建时间:<input type="date" v-model="time"/>
    <input type="button" value="查询" class="btn btn-success" @click="Show"/>
    <input type="button" value="导入" class="btn btn-success" @click="dr"/> 
    <input type="button" value="导出" class="btn btn-success" @click="dc"/> 
    <table class="table" border="1">
        <tr style="background-color: beige;">
            
            <td>房号</td>
            <td>创建时间</td>
            <td>备注</td>
            <td>状态</td>
            <td>操作</td>
        </tr>
        <tbody>
            <tr v-for="item in info">
         
            <td>{{ item.rnRoomnum }}</td>
           <td>{{ item.rnCreatetime.substring(0,10) }}</td>
            <td>--</td>
            <td>{{ item.rnState==true?"上架":"下架" }}</td>
            <td>
                <input type="button" value="下架" @click="Xiajia(item.rnId)"class="btn btn-danger"/> 
                <input type="button" value="删除" @click="Del(item.rnId)" class="btn btn-danger"/> 
                <input type="button" value="编辑" @click="Upd(item.rnId)" class="btn btn-success"/> 
            </td>
        </tr>
        </tbody>
    </table>
</template>
<script setup lang="ts">
     import { ref,onMounted } from 'vue';
     import axios from 'axios';
     import { useRouter } from 'vue-router';

     const router=useRouter();

    onMounted(()=>{
        Show();
    })

    const info=ref([{
        "rnId": 0,
  
  "beizhu": "",
  "rnRoomnum": 0,
  "rnCreatetime": "2024-12-06T01:32:41.976Z",
  "rnState": true,
  "rnDel": true
    }])

    const name=ref("");
    const time=ref();

    const Show=()=>{
        axios.get("https://localhost:7010/api/RoomNum/GetRoomNums",{
            params:{
                Name:name.value,
                time:time.value
            }
        })
        .then(res=>{
            info.value=res.data;
        })
    }


    //下架
    const Xiajia=(id:number)=>{
        axios.put("https://localhost:7010/api/RoomNum/UpdState?id="+id)
        .then(res=>{
        if(res.data>0){
            alert('修改状态成功');
            Show();
        }
     
        else{
            alert('修改状态失败');
        }
    })
    .catch(err=>{
        console.log(err);
    })
    }

    const Del=(id:number)=>{
        if(confirm("是否确定要删除?")){
            axios.put("https://localhost:7010/api/RoomNum/Delnum?id="+id)
        .then(res=>{
        if(res.data>0){
            alert('删除成功');
            Show();
        }
     
        else{
            alert('删除失败');
        }
        })
        .catch(err=>{
            console.log(err);
        })
        }
        
    }

    const Upd=(id:number)=>{
        router.push({
            name: 'Update',
            params:{
                id:id
            }
        })
    }

    const dc=()=>{
        axios.post("https://localhost:7010/api/RoomNum/EditRoomNum?path="+"C:\\RoomNum.xlsx")

        .then(res=>{
        if(res.data>0){
            alert('导出成功');
            
        }
     
        else{
            alert('导出失败');
        }
        })
        .catch(err=>{
            console.log(err);
        })
      
        
    }
    const dr=()=>{
        axios.post("https://localhost:7010/api/RoomNum/ImprotRoomNum?path="+"C:\\RoomNum.xlsx")

        .then(res=>{
        if(res.data>0){
            alert('导入成功');
            Show();
        }
     
        else{
            alert('导入失败');
        }
        })
        .catch(err=>{
            console.log(err);
        })
      
        
    }
</script>